<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<button type="button">按钮1</button>
		<button type="button">按钮2</button>
		<button type="button">按钮3</button>
		<button type="button">按钮4</button>
		<button type="button">按钮5</button>
		<script type="text/javascript">
			//ES5中的var是没有块级作用域的(if/for)
			//ES6中的let是有块级作用域的(if/for)
			
			//ES5之前因为if和for都没有块级作用域的概念，所以在很多时候，我们都必须借助于function的作用域来解决应用外面的问题
			//ES6中，加入了let,let它是有if和for的块级作用域
			//1.变量作用域：变量在什么范围内是可用。
			/* {
				var name='why';
				console.log(name);
			}
			console.log(name); */
			//2.没有块级作用域引起的问题 if的块级
			/* var func;
			if(true){
				var name='why';
				func=function(){
					console.log(name);
				}
				// func();
			}
			name='Kobe';
			func(); */
			// console.log(name)
			
			//3.没有块级作用域引起的问题 for的块级
			//为什么闭包可以解决问题：函数是一个作用域.
			/* var btns=document.getElementsByTagName('button');
			for (var i = 0; i < btns.length; i++) {
				(function(i){
					btns[i].addEventListener('click',function(){
						console.log('第'+i+'个按钮被点击');
					})
				})(i)
			} */
			var name='why';
			function abc(bbb){
				console.log(bbb);
			}
			name="kobe"
			abc("aaaa");
			
			const btns=document.getElementsByTagName('button');
			for (let i = 0; i < btns.length; i++) {
					btns[i].addEventListener('click',function(){
						console.log('第'+i+'个按钮被点击');
					})
			} 
			
		</script>
	</body>
</html>
